<template>
    <LayForm :model="modelValue" :mode="mode" :pane="pane" @submit="submit" class="form">
        <slot></slot>
    </LayForm>
</template>

<script setup lang="ts">
import { LayForm } from '@layui/layui-vue';
import type { FormEmits, FormLayout, IValues } from 'aoe';
import { computed } from 'vue';

const props = defineProps<{
    modelValue?: IValues;
    layout?: FormLayout;
}>();

const emit = defineEmits<FormEmits>();

const mode = computed<'inline' | 'block'>(() => (props.layout === 'inline' ? 'inline' : 'block'));
const pane = computed<boolean>(() => props.layout === 'special');

const submit = (isValid: boolean) => isValid && emit('submit');
</script>

<style scoped></style>
